import { createRouter, createWebHashHistory, RouteRecordRaw } from "vue-router";
// 2. 配置路由
const routes: Array<RouteRecordRaw> = [
  {
    path: "/",
    component: () => import("../views/Home.vue"),
  },
  {
    path: "/home",
    component: () => import("../views/Home.vue"),

  },

  {
    path: "/about",
    component: () => import("../views/About.vue"),
  },

  {
    path: "/ai",
    component: () => import("../views/Ai.vue"),
  },

  {
    path: "/articleDetails",
    meta: {
      scrollToTop: false, // 不滑动到顶部
    },
    component: () => import("../views/ArticleDetails.vue"),
  },
  {
    path: "/author",
    component: () => import("../views/AuthorShow.vue"),
  },
  {
    path: "/biography",
    component: () => import("../views/Biography.vue"),
    meta: {
      requireAuth: true, // 添加该字段，表示进入这个路由是需要登录的
    },
  },
  {
    path: "/community",
    component: () => import("../views/Community.vue"),
  },
  {
    path: "/contentlog",
    component: () => import("../views/ContentLogs.vue"),
  },
  {
    path: "/editor",
    component: () => import("../views/Editor.vue"),
    meta: {
      requireAuth: true, // 添加该字段，表示进入这个路由是需要登录的
    },
  },
  {
    path: "/login",
    component: () => import("../views/Login.vue"),
  },
  {
    path: "/register",
    component: () => import("../views/Register.vue"),
  },
  {
    path: "/study",
    component: () => import("../views/Study.vue"),
  },
  {
    path: "/program",
    component: () => import("../views/Program.vue"),
  },
  {
    path: "/editProgram",
    component: () => import("../views/EditProgram.vue"),
    meta: {
      requireAuth: true, // 添加该字段，表示进入这个路由是需要登录的
    },
  },
];
// 1.返回一个 router 实列，为函数，里面有配置项（对象） history
const router = createRouter({
  scrollBehavior(to, _from, _savedPosition) {
    // 始终滚动到顶部
    // 根据情况决定是否滑动到顶部
    if (to.meta.scrollToTop === false) {
      return;
    }
    return { top: 0 }
  },
  // 如果使用createWebHistory()需要服务端配置路由回退，所以打包后会空白
  history: createWebHashHistory(),
  routes,
});

//next 进行下一个路由 需要放行
router.beforeEach((to, _from, next) => {
  //初始化，防止null
  let token: any = {}
  //尝试获取
  try {
    let tokenString: any = localStorage.getItem('auth');
    //token被赋值为对象
    if(tokenString !== "" && tokenString !== undefined){
      token = JSON.parse(tokenString);
      //token为null，重新赋值
        if (token === null) {
          token = {
            "loginStatus": false,
            "accessToken": ""
          }
        }
    }
   
  }
  catch (error) {
    //token被赋值为null
    console.log("页面跳转错误")
    console.log(error)
  }

  //判断该路由是否需要登录权限
  if (to.meta.requireAuth) {
    //当前的token是否存在    注意token有时效性：在axiso拦截器内处理
    try {

      if (token.accessToken.length > 10 && token !== null && token.accessToken !== undefined) {
        next();//存在就说明登录了，放行
      }
      else {
        next({  //不存在，回到登录页面
          path: '/login',
        })
      }
    } catch (error) {
      next({  //不存在，回到登录页面
        path: '/login',
      })
    }
  }
  else {
    //不需要验证的直接放行
    next();
  }
})

// 3导出路由   然后去 main.ts 注册 router.ts
export default router